#report
  padding 2.5rem 0

  .row
    margin 0

  .col-sm-3
    height 12.5rem
    padding 0
    margin 0

  a.col-sm-3
    background-color white
    display block
    padding 1em 1.5em
    position relative

    &:hover
      background-color #333
      text-decoration none

      h3,p
        color white

    &::before
      background-color $active-color
      border-radius 50%
      color white
      font-family 'FontAwesome'
      font-size 2rem
      width 2rem
      height 2rem
      line-height 1
      text-align center
      position absolute
      top 50%
      margin-top -1rem
      z-index 10

    &.left::before
      content '\f104'
      left -1rem
      padding-right .2rem

    &.right::before
      content '\f105'
      right -1rem
      padding-left .25rem

  h2
    background-color $active-color
    color white
    line-height 12.5rem
    text-indent .75em

  img
    width 100%
    height 100%
    object-fit cover

  h3
    color #333
    font-size 1.5rem
    line-height 1.5
    margin-bottom .5em

  p
    color #999

  @media (min-width $sm-min-width)
    & h2
      font-size 2.25rem

  @media (max-width $xs-max-width)
    &
      padding 0 2.5rem 1rem

      .col-sm-3
        height 100px

      h2.col-sm-3
        height auto
        background-color transparent
        font-size 1.5rem
        line-height 3
        text-align center
        text-indent 0

      h3
        font-weight normal
        font-size 1rem

      .xs-order-2
        order 2

      .xs-order-3
        order 3

      .xs-left::before
        content '\f104' !important
        left -1rem
        right auto
        padding-left 0
        padding-right .2rem